import {Component, Input, OnInit} from '@angular/core';
import {DhlCommonComponent} from '../dhlCommonComponent';
import {TagSize, TagType} from '../enums';

@Component({
  selector: 'dhl-tag',
  templateUrl: './dhl-tag.component.html'
})
export class DhlTagComponent extends DhlCommonComponent implements OnInit {

  classList = ['dhl-tag-div', 'dhl-tag-size-small'];
  style = {};

  @Input() text;

  @Input() set tagWidth(value) {
    this.style = {width: `${value}px`};
  };


  @Input() set color(color) {
    this.setColor(color);
  }

  @Input() set size(size) {
    this.setSize(size);
  };

  ngOnInit(): void {

  }

  setSize(size) {
    const temp = ['dhl-tag-div'];

    for (const s of this.classList) {
      if (s.indexOf('dhl-tag-color') >= 0) {
        temp.push(s);
      }
    }

    switch (size) {
      case TagSize.LARGE:
        temp.push('dhl-tag-size-large');
        break;
      case TagSize.SMALL:
        temp.push('dhl-tag-size-small');
        break;
      default:
        temp.push('dhl-tag-size-normal');
        break;
    }

    this.classList = temp;
  }

  setColor(color) {
    const temp = ['dhl-tag-div'];

    for (const s of this.classList) {
      if (s.indexOf('dhl-tag-size') >= 0) {
        temp.push(s);
      }
    }

    switch (color) {
      case TagType.YELLOW:
        temp.push('dhl-tag-color-yellow');
        break;
      case TagType.GREY:
        temp.push('dhl-tag-color-grey');
        break;
      case TagType.GREEN:
        temp.push('dhl-tag-color-green');
        break;
      case TagType.RED:
        temp.push('dhl-tag-color-red');
        break;
      default:
        temp.push('dhl-tag-color-yellow');
        break;
    }
    this.classList = temp;
  }


}

